<template>
	<view>
		<view class="information">
			<text class='subject'>{{info.project.name}}</text>
			<text class='createtime'>开始时间：{{info.createtime}}</text>
			<text class='content'>备注：{{info.content}}</text>
			<text class='price' v-if="info.status == 1 && info.price >= 0">价格：￥{{info.price}}</text>
		</view>
		<view class='mar'> </view>
		<!-- 评分开始 -->
		<view class="process">
			<text class="title">感谢您的支持，评分后会奖励积分</text>
		
			<u-rate size="35" inactive-icon="heart" active-icon="heart-fill" v-model="rate"></u-rate>
		
			<u-button class="btn" size="mini" @click="submit" type="success">提交</u-button>
		</view>
		
		<!-- 消息提示的组件 -->
		<u-toast ref="notice"></u-toast>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				id: null,
				info:{
					project:{}
				},
				rate: 0,
				LoginUser: null
			}
		},
		onLoad(options){
			console.log(options)
			//判断是否有登录
			this.$u.auth.check()
			this.LoginUser = uni.getStorageSync('LoginUser')
			if(!options || JSON.stringify(options) == "{}")
			{
				//提醒，返回上一个界面 
				this.$refs.notice.show({
					message: '预约信息不存在',
					type: 'success',
					complete: () => {
						uni.$u.route({
							type: 'navigateBack',
							delta: 1
						})
					}
				})
			
				return false
			}
			this.id = options.id ? options.id : 0
			this.orderinfo();
		},
		methods:{
			async submit(){
				let data = {
					rate: this.rate,
					id: this.id,
					userid: this.LoginUser.id
				}
				let result = await this.$u.api.project.ProjectRate(data)
				if(result.code == '1'){
					//提醒，返回上一个界面
					this.$refs.notice.show({
						message: result.msg,
						type: 'success',
						complete: () => {
							uni.$u.route({
								type: 'navigateBack',
								delta: 1
							})
						}
					})
				} else{
					//提醒，返回上一个界面
					this.$refs.uToast.show({
						message: result.msg,
						type: 'error',
					})
					return false
				}
			},
			async orderinfo(){
				let data = {
					id: this.id,
					userid: this.LoginUser.id
				}
				let result = await this.$u.api.project.ProjectInfo(data)
				if(result.code == 0)
				{
					//提醒，返回上一个界面 
					this.$refs.notice.show({
						message: result.msg,
						type: 'success',
						complete: () => {
							uni.$u.route({
								type: 'navigateBack',
								delta: 1
							})
						}
					})
				
					return false
				}
				
				this.info = result.data
			}
		}
	}
</script>

<style>
	/* pages/query/query.wxss */
	page{
	background-color: rgb(247,247,247);
	}
	.information{
	border-top: 1rpx solid rgb(194, 194, 194);
	border-bottom: 30rpx solid rgb(240, 240, 240);
	padding: 30rpx;
	box-shadow: 0 0 10px #DDD;
	}
	.begin-time, .end-time{
	font-size: 30rpx;
	color: rgb(140, 140, 140);
	}
	.information text{
	
	display: block;
	
	}
	.mar{
	width: 95%;
	margin: 20rpx auto;
	height: 2rpx;
	background-color: #CCCCCC;
	}
	.progres-done,.progres-undone{
		width: 550rpx;
		margin: 50rpx 50rpx 0 150rpx;
		position: relative;
		/* height: 150rpx; */
		height: 100rpx; /*暂时设置为固定*/
	}
	.progres-done{
	
	}
	.progres-undone{
	color: rgb(140, 140, 140);
	}
	.line{
	width:6rpx;
	height: 130rpx;
	background-color: #CCCCCC;
	display: inline-block;
	position: absolute;
	top:60rpx;
	left: -50rpx;
	z-index: 2;
	}
	.progres-done .line{
	background-color: rgb(78,169,245);
	}

	icon{
	display: inline-block;
	position: absolute;
	top:30rpx;
	left: -67rpx;
	z-index: 3;
	}
	.cateA{
	display: inline-block;
	position: relative;
	width:500rpx;
	padding:15rpx;
	/*border-bottom: 1rpx solid #CCCCCC;*/
	box-shadow: 0 0 10rpx #DDD;
	margin-top:20rpx;
	}
	.cate{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	font-size: 32rpx;
	}
	.cate-stat{
	font-size: 26rpx;
	
	}
	.progres-done{
	color: rgb(1,115,222);
	}
	.pro-time{
	font-size: 26rpx;
	
	}
	#last{
	display: none;
	}

	.process{
		text-align:center;
	}

	.process .title{
		display:block;
		font-size:35rpx;
		font-weight:bold;
		margin-bottom:1em;
	}

	.process button{
		display:block;
		margin-top:1em;
		width:20%!important;
	}

	.process .u-rate__content{
		/* margin:0 auto!important; */
	}
	

</style>
